<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <title>订单</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link href="/css2/iconfont/iconfont.css" rel="stylesheet"/>
    <link href="/css2/common.css" rel="stylesheet"/>
    <link href="/css2/uc.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="/layui/css/layui.css">
</head>
<body>
<!--头部-->
<th:block th:include="header1"/>

<div class="wrapper uc-router">
    <ul>
        <li><a href="">首页</a></li>
        <li><span class="divider"></span></li>
        <li><span>个人中心</span></li>
    </ul>
</div>

<div class="wrapper">
    <div class="uc-main clearfix">
        <div class="uc-aside">
            <div class="uc-menu">
                <div class="tit">订单中心</div>
                <ul class="sublist">
                    <li><a class="active" href="">我的订单</a></li>
                    <li><a href="">我的收藏</a></li>
                    <li><a href="">浏览历史</a></li>
                </ul>
                <div class="tit">客户服务</div>
                <ul class="sublist">
                    <li><a href="">取消订单记录</a></li>
                    <li><a href="">退款/退货</a></li>
                </ul>
                <div class="tit">账户中心</div>
                <ul class="sublist">
                    <li><a href="">账户信息</a></li>
                    <li><a href="">账户安全</a></li>
                    <li><a href="">消费记录</a></li>
                    <li><a href=" /inventory/address1">收货地址</a></li>
                </ul>
                <div class="tit">消息中心</div>
                <ul class="sublist">
                    <li><a href="">商品评价</a></li>
                    <li><a href="">站内消息</a></li>
                </ul>
            </div>
        </div>
        <div class="uc-content">
            <div class="uc-panel">
                <div class="uc-bigtit">我的订单</div>
                <div class="uc-panel-bd">
                    <div class="uc-sort">
                        <div class="uc-tabs">
                            <a class="item active" href="">所有订单</a>
                            <a class="item" id="0">待付款</a>
                            <a class="item" id="1">待发货</a>
                            <a class="item" id="2">待收货</a>
                            <a class="item" id="3">待评价</a>
                        </div>
                        <div class="uc-search">
                            <input type="text" class="sch-input" placeholder="输入商品名称,订单号，商品编号"/>
                            <button class="sch-btn"><i class="iconfont icon-search"></i></button>
                        </div>
                    </div>
                    <!--遍历商品的位置-->
                    <div class="ta-c">
                        <ul class="pagination">
                            <li class="disabled" id="orderLI">

                            </li>
                        </ul>
                        <!--分页-->
                        <div id="pageDIV" class="order-rotate">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script id="orderTemplate" type="text/html">
    {{# layui.each(d,function(index,item){   }}
    <table class="uc-table">
        <tr class="hd order-meta">
            <td colspan="4">
                <div class="left">{{=item.createTime}} 订单号: {{=item.code}}</div>
            </td>
        </tr>
        <tr class="order-goods">
            <td>
                {{# layui.each(item.details,function(i,v){ }}
                <div class="goods-info">
                    <img class="figure" src="{{=v.imgPath}}" alt=""/>
                    <a class="text-info refund" href="">申请退货</a>
                    <div class="info">
                        <div>{{=v.name}} {{=v.color}} {{=v.edition}}</div>
                        <div>{{=v.price}}元×{{=v.amount}}</div>
                    </div>
                </div>
                {{# }) }}
            </td>
            <td>
                金额：<span class="text-theme fwb">{{=item.price}}元</span>
            </td>
            <td>
                {{# if(item.status =='已签收'){ }}
                <span class="status">快件已签收</span><br/>
                {{# } }}
                <a class="text-info" href="/uc-order-detail">订单详情</a><br/>
                <a class="text-info" href="">查看物流</a>
            </td>

            <td>
                {{# if(item.status =='待支付'){ }}
                <a href="/order/pay?id={{item.id}}" class="ui-btn-theme uc-btn-md">去付款</a>
                <a href="" class="ui-btn-low ui-btn-hollow uc-btn-md mt10">取消订单</a>
                {{# } }}
                {{# if(item.status =='已支付'){ }}
                等待发货
                <a href="" class="ui-btn-low ui-btn-hollow uc-btn-md mt10">退货/退款</a>
                {{# } }}
                {{# if(item.status =='待收货'){ }}
                <a href="/uc-order/confirm?id={{=item.id}}" class="ready ui-btn-theme uc-btn-md" >确认收货</a>
                <a href="" class="ui-btn-low ui-btn-hollow uc-btn-md mt10">退货/退款</a>
                {{# } }}
                {{# if(item.status =='已签收'){ }}
                <a href="" class="ui-btn-theme uc-btn-md">追加评论</a>
                {{# } }}
            </td>
        </tr>
    </table>
    {{#       })    }}
</script>


<!--脚部-->
<div class="fatfooter">
</div>
<!--脚部-->
</body>
<script src="/js2/jquery.js"></script>
<link rel="stylesheet" href="/js2/icheck/style.css"/>
<script src="/js2/icheck/icheck.min.js"></script>
<script src="/js2/global.js"></script>
<script src="/layui/layui.js"></script>
<script>
    layui.use(["laypage", "laytpl"], function () {
        var laypage = layui.laypage;
        var $ = layui.jquery;
        var laytpl = layui.laytpl;
        var limit = 5;
        var page = 1;
        $(".sch-btn").on("click", function () {
            $.get("/uc-order/list?status=&keyword=&limit=" + limit + "&page=" + page, function (orders) {
                console.log(orders);
                laytpl($("#orderTemplate").html()).render(orders.data, function (a) {
                    $("#orderLI").html(a);
                });
                laypage.render({
                    elem: 'pageDIV',
                    count: orders.count, // 数据总数
                    curr: page,
                    limit: limit,
                    jump: function (obj, first) {
                        if (!first) {
                            page = obj.curr;
                            $(".sch-btn").click();
                        }
                    }
                });
            });
        });
        $(".sch-btn").click();
    })
</script>
</html>